<template>
	<view class="main" v-for="item in 20" :key="item" @click="$goUrl(`/subPackage/order/orderDetail?id=${item}`)">
		<view class="one dispaly-center">
			<view class="status dispaly-align-center" :class="{'ac': item % 2 == 0}">待接单</view>
			<view class="name">晚礼服定制</view>
		</view>
		<view class="item dispaly-center">
			<view class="left">购买单号</view>
			<view class="right">GM251354513541</view>
		</view>
		<view class="item dispaly-center">
			<view class="left">服装类型</view>
			<view class="right">中式礼服</view>
		</view>
		<view class="item dispaly-just-between">
			<view class="dispaly-center">
				<view class="left">发布时间</view>
				<view class="right">2024-07-25</view>
			</view>
			<view>
				<u-icon name="arrow-right" color="#020121" size="28"></u-icon>
			</view>
		</view>
	</view>
</template>

<script>
</script>

<style lang="scss" scoped>
	.ac {
		background: #B6B6BB !important;
	}

	.main:last-child {
		margin-bottom: 0;
	}

	.main {
		background: #FFFFFF;
		border-radius: 20rpx;
		padding: 28rpx 24rpx;
		margin-bottom: 16rpx;

		.one {
			margin-bottom: 16rpx;

			.status {
				width: 104rpx;
				height: 40rpx;
				background: #020121;
				font-family: Source Han Sans, Source Han Sans;
				font-weight: 400;
				font-size: 22rpx;
				color: #FFFFFF;
				border-radius: 10rpx;
				margin-right: 16rpx;
			}

			.name {
				font-family: Source Han Sans, Source Han Sans;
				font-weight: 500;
				font-size: 32rpx;
				color: #020121;
			}
		}

		.item:last-child {
			margin-bottom: 0;
		}

		.item {
			margin-bottom: 16rpx;

			.left {
				font-family: Source Han Sans, Source Han Sans;
				font-weight: 400;
				font-size: 28rpx;
				color: #7B7B89;
				margin-right: 40rpx;
			}

			.right {
				font-family: Source Han Sans, Source Han Sans;
				font-weight: 400;
				font-size: 28rpx;
				color: #020121;
			}
		}
	}
</style>